<template>
	<!-- 头部编辑，完成部分-->
	<view class="header">
		<view>
			<text></text>
		</view>
		<view>
			<text>我的收藏</text>
		</view>
		<view>
			<text @click="edit">编辑</text>
		</view>
	</view>
	<!-- 内容 -->
	<view class="content">
		<view class="content_image"><image src="../../static/collection-image/冲锋衣.jpeg" mode=""></image></view>
		<view class="content_describe">
			<text>2018年新款冲锋衣秋冬款新品推荐 户外冲锋衣</text>
			<text>￥250</text>
		</view>
		<view class="content_state">
			<image src="../../static/collection-image/下架.png" mode=""></image>
		</view>
	</view>
	<view class="content">
		<view class="content_image"><image src="../../static/collection-image/冲锋衣.jpeg" mode=""></image></view>
		<view class="content_describe">
			<text>2018年新款冲锋衣秋冬款新品推荐 户外冲锋衣</text>
			<text>￥250</text>
		</view>
		<view class="content_state">
			<image src="../../static/collection-image/下架.png" mode=""></image>
		</view>
	</view>
	<view class="content">
		<view class="content_image"><image src="../../static/collection-image/冲锋衣.jpeg" mode=""></image></view>
		<view class="content_describe">
			<text>2018年新款冲锋衣秋冬款新品推荐 户外冲锋衣</text>
			<text>￥250</text>
		</view>
		<view class="content_state">
			<image src="../../static/collection-image/下架.png" mode=""></image>
		</view>
	</view>
	<view class="content_bot">
		<text>已加载全部</text>
	</view>
</template>

<script>
	import http from '../../until/http';
	export default {
		data() {
			return {
				edit(){
					uni.showModal({
						title: '提示',
						content: '确认删除所选商品么？',
						success: function (res) {
							if (res.confirm) {
								console.log('确定');
							} else if (res.cancel) {
								console.log('取消');
							}
						}
					});
				},
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="less" scoped>
	// 头部编辑部分
	.header{
		display: flex;
	    text-align: center;
		border-bottom: 1px solid #F2F2F2;
		view:first-child{
			flex: 1;
		}
		view:nth-child(2){
			flex: 1;
			margin: 10px 10px;
		    font-size: 18px;
		}
		view:last-child{
		   flex: 1;
		   text-align: right;
           margin: 10px 10px;
		   font-size: 14px; 
		}
	}
	// 内容
	.content{
		height: 100px;
		display: flex;
		align-items: center;
		margin: 10px 0;
		border: 1px solid #F2F2F2;
		  .content_image{
			 flex: 1;
			 margin-left: 20px;
			  image{
				  width: 80px;
				  height: 80px;
				  border: 1px solid #F2F2F2;
			  }
		  }
		  .content_describe{
			  flex: 3;
			  text-align: left;
			  margin: 0 10px;
			  text{
			      padding: 5px 0;
				  width: 150px;
				  display: block;
				  font-size: 14px;
			  }
		  }
		  .content_state{
			  flex: 1;
			  display: flex;
			  align-items: center;
			  image{
				  border: 1px solid #F2F2F2;
				  width: 50px;
				  height: 50px;
			      
			  }
		  }
	}
    .content_bot{
	  text-align: center;
  }
	

</style>
